import React, { useImperativeHandle } from "react";
import { Form, Input, Radio } from 'antd';

import { IOuterCreateOrEditProps } from "vendor/components/pro-table-native";
import { getEnv } from "@/constants";

const layout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 13 },
};

export const CreateOrEdit: IOuterCreateOrEditProps["CreateOrEditContent"] = React.forwardRef(({ values }, actionRef) => {
  const { commonStatusList, commonStatus } = getEnv().globalConfig;
  const [form] = Form.useForm();
  useImperativeHandle(actionRef, () => ({
    getFormData: () => new Promise((resolve, reject) => {
      form.validateFields().then((data) => {
        resolve(data);
      }).catch(() => {
        reject(new Error("请检查参数"));
      });
    })
  }));

  return (
    <Form
      {...layout}
      initialValues={{
        status: commonStatus.normal,
        ...values
      }}
      form={form}
    >
      <Form.Item
        label="字典名称"
        name="dictName"
        rules={[{ required: true, message: '请填写字典名称!' }]}
      >
        <Input />
      </Form.Item>
      <Form.Item
        label="字典类型"
        name="dictType"
        rules={[{ required: true, message: '请填写字典类型!' }]}
      >
        <Input />
      </Form.Item>
      {/*<Form.Item*/}
      {/*    label="显示排序"*/}
      {/*    name="dictSort"*/}
      {/*    rules={[{ required: true, message: '请填写显示排序!' }]}*/}
      {/*>*/}
      {/*    <InputNumber min={0} />*/}
      {/*</Form.Item>*/}
      <Form.Item
        label="状态"
        name="status"
      >
        <Radio.Group>
          {commonStatusList.map(({ label, value }) => <Radio key={value} value={value}>
            {label}
          </Radio>)}
        </Radio.Group>
      </Form.Item>

      <Form.Item label="备注" name="remark">
        <Input.TextArea />
      </Form.Item>
    </Form>
  )
});
